import headerImgUploader from "../Components/headerImgUploader";
const editBtn = (h, param,vm) => {
    let canEdit = false;
    if (param.row.is_public == '1' && param.row.is_answer == '1' && param.row.order_state == '1') {
        canEdit = true;
    }
    return h('Button', {
        props: {
            type: "primary",
            icon: 'edit',
            disabled: !canEdit
        },
        style: {
            'margin-right': '10px',
        },
        on: {
            click: () => {
                vm.selectOrder = param.row;
                vm.selectOrder._index = param.index;
                vm.isShow = param.row.is_top == '1' ? true : false;
                vm.uploadImgCallbackPath = param.row.top_img_path;
                vm.showModal = true;
            }
        }
    })
}
const refundBtn = (h, param,vm) => {
    let canRefund = false;
    let time = new Date().getTime() - new Date(param.row.createtime.replace(/-/g,'/')).getTime() > 72*60*60*1000;
    if (param.row.is_answer == '0' && param.row.order_state == '1' && time) {
        canRefund = true;
    }
    return h(
        "Poptip", {
            props: {
                confirm: true,
                title: "确定要为其退款?",
                transfer: true
            },
            on: {
                "on-ok": () => {
                    vm.doRefund(param.row, param.index)
                }
            }
        }, [
            h('Button', {
                class: 'refund-btn',
                style: {
                    'width': '40px',
                    'padding': '6px 0',
                },
                props: {
                    type: "error",
                    disabled:!canRefund
                },
                on: {
                    click: () => {

                    }
                }
            }, '退款')
        ]
    )
}

export default {
    components: {
        headerImgUploader
    },
    computed: {
        user() {
            return this.$store.state.user.data
        }
    },
    data() {
        return {
            askingTableColumns: [{
                'title': '订单号',
                'align': 'center',
                'key': 'out_trade_no',

            }, {
                'title': '用户',
                'align': 'center',
                'key': 'nickname',

            }, {
                'title': '订单状态',
                'align': 'center',
                'key': 'order_state',
                'width': 90
            }, {
                'title': '支付方式',
                'align': 'center',
                'key': 'pay_method',
                'width': 110

            }, {
                'title': '是否公开',
                'align': 'center',
                'key': 'is_public',
                'width': 90
            }, {
                'title': '置顶展示',
                'align': 'center',
                'key': 'is_top',
                'width': 90
            }, {
                'title': '是否回答',
                'align': 'center',
                'key': 'is_answer',
                'width': 90

            }, {
                'title': '提问时间',
                'align': 'center',
                'key': 'createtime',
                'width': 100

            }, {
                'title': '导师名称',
                'align': 'center',
                'key': 'real_name',
                'width': 100
            }, {
                'title': '操作',
                'align': 'center',
                'key': 'action',
                'action': true,
                'width': 130
            }],
            searchKey: '',
            pageCount: 0,
            pageNum: 1,
            pageLoading: false,
            showModal: false,
            modalLoading: true,
            uploadImgCallbackPath: '',
            askingList: [],
            selectOrder: '',
            isShow: false,
            uploadImgData: {}
        }
    },
    methods: {
        /**
         * @param {Boolean} type
         * 设置确定按钮loading动画，传True或者False
         */
        changeLoadingStatus(type) {
            if (!type) {
                this.modalLoading = false;
            }
            this.$nextTick(() => {
                this.modalLoading = true;
            });
        },
        doSearch() {
            this.pageNum = 1;
            this.getAskingOrderList();
        },
        clearSearch() {
            this.searchKey = '';
            this.pageNum = 1;
            this.getAskingOrderList();
        },
        changePage(num) {
            this.pageNum = num;
            this.getAskingOrderList();
            document.querySelector('.single-page-con').scrollTo(0, 0)

        },
        getAskingOrderList() {
            if (this.pageLoading) return
            this.pageLoading = true;
            this.http.post(this.postUrl.getAskingOrderListUrl, {
                token: this.user.tokenList[0],
                pageNum: this.pageNum,
                pageSize: 20,
                key_word: this.searchKey
            }).then((data) => {
                console.log(data);
                if (data.code > -1) {
                    this.pageCount = data.data.totalRow;
                    this.askingList = JSON.parse(JSON.stringify(data.data.list));
                } else {
                    this.errorHandle(data.msg)
                }
            }, () => {
                this.errorHandle()
            }).then(() => {
                this.pageLoading = false;
            })
        },
        uploadImgSuccess(data) {
            this.uploadImgCallbackPath = data;
        },
        createImgUploadData() {
            //上传图片
            let uploadImgData = {
                token: this.user.tokenList[0],
                type: 1,
                app_key: this.http.app_key,
                timestamp: "2017-09-26 15:52:28"
            }
            let uploadImgDataSign = this.http.getSign({
                type: 1,
                token: this.user.tokenList[0]
            });
            uploadImgData.sign = uploadImgDataSign;
            this.uploadImgData = uploadImgData;
        },
        clickOK() {
            this.changeLoadingStatus(true)
            if (this.isShow) {
                if (!this.uploadImgCallbackPath) {
                    this.changeLoadingStatus(false);
                    this.errorHandle("请先上传图片！");
                    return;
                }
            }
            let oldTop= this.askingList[this.selectOrder._index].is_top == '1'?true:false
            if(oldTop == this.isShow){
                this.changeLoadingStatus(false);
                this.$Message.warning('置顶状态未改变');
                return;

            }
            this.http.post(this.postUrl.editAskingOrderIsTop, {
                token: this.user.tokenList[0],
                uuid: this.selectOrder.uuid,
                order_state: this.selectOrder.order_state,
                is_answer: this.selectOrder.is_answer,
                is_public: this.selectOrder.is_public,
                is_top: this.isShow ? '1' : '0',
                top_img_path: this.uploadImgCallbackPath
            }).then((data) => {
                if (data.code > -1) {
                    this.$Notice.success({
                        title: '修改成功！'
                    })
                    this.showModal = false;
                    this.getAskingOrderList();
                } else {
                    this.errorHandle(data.msg)
                }
                this.changeLoadingStatus(false)

            }, () => {
                this.errorHandle()
                this.changeLoadingStatus(false)

            })
        },
        doRefund(order, index) {
            this.http.post(this.postUrl.askingOrderRefund, {
                token: this.user.tokenList[0],
                uuid: order.uuid,
                pay_method:order.pay_method,
                createtime:order.createtime,
                app_user_uuid:order.app_user_uuid,
                total_fee:order.total_fee,
                love_beans_num:order.love_beans_num,
                out_trade_no:order.out_trade_no,
                order_state:order.order_state
            }).then((data) => {
                if (data.code > -1) {
                    this.$Notice.success({
                        title: '操作成功！',
                    })
                    this.$set(this.askingList[index], 'order_state', '3')
                } else {
                    this.errorHandle(data.msg)
                }
            }, () => {
                this.errorHandle()
            })
        }
    },
    created() {
        this.askingTableColumns.forEach(item => {
            if (item.key === 'pay_method') {
                item.render = (h, param) => {
                    let payText = '';
                    switch (param.row.pay_method) {
                        case '0':
                            payText = '公众号支付'
                            break;
                        case '1':
                            payText = '微信支付'
                            break;
                        case '2':
                            payText = '支付宝'
                            break;
                        case '3':
                            payText = '爱豆支付'
                            break;
                    }
                    return h("span", payText);
                };
            }
            if (item.key === 'order_state') {
                item.render = (h, param) => {
                    let stateText = '';
                    switch (param.row.order_state) {
                        case '0':
                            stateText = '待付款'
                            break;
                        case '1':
                            stateText = '交易成功'
                            break;
                        case '2':
                            stateText = '交易关闭'
                            break;
                        case '3':
                            stateText = '已退款'
                            break;
                    }
                    return h("span", stateText);
                };
            }
            if (item.key == 'is_public' || item.key == 'is_top' || item.key == 'is_answer') {
                item.render = (h, param) => {
                    let type = '';
                    switch (item.key) {
                        case 'is_public':
                            type = param.row.is_public
                            break;
                        case 'is_top':
                            type = param.row.is_top
                            break;
                        case 'is_answer':
                            type = param.row.is_answer
                            break;

                    }
                    return h('Icon', {
                        props: {
                            type: type == '1' ? 'checkmark-circled' : 'close-circled',
                            size: 16,
                            color: type == '1' ? "#00a854" : '#f04134'
                        }
                    })
                };
            }
            if (item.action) {
                item.render = (h, param) => {
                    return h('div', [
                        editBtn(h,param,this),
                        refundBtn(h,param,this)
                    ])
                };

            }
        })
        if (this.user) {
            this.getAskingOrderList()
            this.createImgUploadData()
        }
    },
    watch: {
        user(val, old) {
            if (!old && val) {
                this.getAskingOrderList()
                this.createImgUploadData()

            }
        },
        showModal(val) {
            if (!val) {
                setTimeout(()=>{
                    this.selectOrder = '';
                    this.uploadImgCallbackPath = "";
                    this.isShow = false;
                },300)
            }
        }
    }
}
